<!-- 中介公司管理 -->
<template>
    <div class="company">
        <header>
            <div class="search">
                <el-form :inline="true" :model="searchData" class="demo-form-inline">
                    <el-form-item label="公司名字">
                        <el-input v-model="searchData.anm_branch_name" placeholder="公司名字:"></el-input>
                    </el-form-item>
                    <el-date-picker type="date" placeholder="选择开始时间" v-model="searchData.start_time" value-format="yyyy-MM-dd"></el-date-picker>
                    <el-date-picker type="date" placeholder="选择结束时间" v-model="searchData.end_time" value-format="yyyy-MM-dd"></el-date-picker>
                    <el-form-item >
                        <el-button type="primary"  @click="search">查询</el-button>
                    </el-form-item>
                    <span style="display:inline-block;font-size:14px;padding-left:15px;">账号数量: {{accountNumber}}</span>
                    <span style="display:inline-block;font-size:14px;padding-left:15px;">总金额: {{accountMoney}}元</span>
                    <el-button type="primary" icon="el-icon-circle-plus-outline" @click="add" style="float:right" size="medium">添加账号</el-button>
                </el-form>
            </div>
        </header>
        <!-- 列表 -->
        <div class="list">
            <el-table ref="multipleTable" :data="list.data" tooltip-effect="dark" style="width: 100%">
                <el-table-column align='center' prop="u_account_number" label="账号" width="120"></el-table-column>
                <el-table-column align='center' :formatter="accountState" prop="anm_status" label="账号状态" width="120"></el-table-column>
                <el-table-column align='center' prop="anm_branch_name" label="公司" width="120" show-overflow-tooltip></el-table-column>
                <el-table-column align='center' prop="anm_area" label="所属区域" width="120"></el-table-column>
                <el-table-column align='center' prop="anm_branch_address"  label="公司地址" width="150" show-overflow-tooltip></el-table-column>
                <el-table-column align='center' prop="anm_legal" label="公司法人" width="120"></el-table-column>
                <el-table-column align='center' prop="anm_legal_phone" label="法人电话" width="120"></el-table-column>
                <el-table-column align='center' prop="anm_principal" label="负责人" width="120"></el-table-column>
                <el-table-column align='center' prop="anm_principal_phone" label="负责人电话" width="120"></el-table-column>
                <el-table-column align='center' :formatter="accountFunc" prop="anm_current_grade" label="本次等级" width="120"></el-table-column>
                <el-table-column align='center' :formatter="loginFunc" prop="anm_app_login" label="app能否登录" width="120"></el-table-column>
                <el-table-column align='center' prop="anm_current_years" label="本次购买年限" width="70"></el-table-column>
                <el-table-column align='center' prop="anm_current_buytime" label="本次购买时间" width="140"></el-table-column>
                <el-table-column align='center' prop="anm_current_reminding" label="本次提醒时间" width="140"></el-table-column>
                <el-table-column align='center' prop="anm_expirytime" label="本次过期时间" width="140"></el-table-column>
                <!-- <el-table-column align='center' property="anm_business_license" label="营业执照" width="150"></el-table-column> -->
                <el-table-column fixed="right" label="操作" width="140">
                <template slot-scope="scope">
                    <el-button @click.native.prevent="payrecord(scope.row)" type="text" size="small" style="margin-left: 10px;">续费记录</el-button>
                    <el-button @click.native.prevent="renewFun(scope.row)" type="text" size="small">续费</el-button>
                    <!-- <el-button @click.native.prevent="editState(scope.row)" type="text" size="small">更改账号状态</el-button> -->
                    <el-button @click.native.prevent="edit(scope.row)" type="text" size="small">编辑账号</el-button>
                    <el-button @click.native.prevent="creatform(scope.row)" type="text" size="small">创建表</el-button>
                </template>
                </el-table-column>
            </el-table>
            <!-- 分页 -->
            <el-pagination :current-page="current" @current-change="handletypeCurrentChange" :total="list.total" style="margin-top:30px;"></el-pagination>
        </div>
        <!-- 续费列表 -->
        <el-dialog title="续费记录" :visible.sync="renewVisible" width="70%" center>
            <el-table :data="renewRecord.data">
                <el-table-column align='center' property="anm_branch_name" label="公司名称" width="150"></el-table-column>
                <el-table-column align='center' property="nm_money" label="缴费金额" width="100"></el-table-column>
                <el-table-column align='center' property="nm_create_time" label="缴费时间" width="150"></el-table-column>
                <el-table-column align='center' property="operator" label="操作人" width="120"></el-table-column>
                <el-table-column align='center' property="ap_name" label="购买套餐" width="120"></el-table-column>
                <el-table-column align='center' :formatter="accountNm_State" property="nm_status" label="状态" width="80"></el-table-column>
                <el-table-column align='center' :formatter="accountNm_Type" property="nm_type" label="有效状态" width="80"></el-table-column>
                <el-table-column align='center' property="examine" label="审核人" width="120"></el-table-column>
                <el-table-column align='center' property="nm_update_time" label="审核时间" width="150"></el-table-column>
                <el-table-column label="操作" align="center">
                    <template slot-scope="scope">
                        <el-button v-if="renewRecord.data[scope.$index].nm_type === 1" @click.native.prevent="examineFun(scope.row)" size="mini" type="text" :disabled="scope.row.nm_status == 1">通过审核</el-button>
                        <el-button v-else-if="renewRecord.data[scope.$index].nm_type === 2" type="text" size="small" disabled>已通过</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <!-- 分页 -->
            <el-pagination :current-page="recordCurrent" @current-change="recordCurrentChange" :total="renewRecord.total" style="margin-top:30px;"></el-pagination>
        </el-dialog>
        <!-- 续费 -->
        <el-dialog title="续费" :visible.sync="renew" width="600px" center>
            <el-form label-width="100px" :model="renewData" :rules="rules" ref="renewData">
                <el-form-item label="购买类型" prop="anm_grade">
                    <el-select v-model="renewData.anm_grade" placeholder="请选择购买类型">
                        <el-option v-for="(item,index) in gradeList" :key="index" :label="item.ap_name" :value="item.ap_id"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="购买年限" prop="anm_years">
                    <el-input type="number" v-model="renewData.anm_years" placeholder="请输入购买年限" min="1"></el-input>
                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="cancelRenew('renewData')">取 消</el-button>
                <el-button type="primary" @click="submitRenew('renewData')">确 定</el-button>
            </div>
        </el-dialog>
        <!-- 添加账号 -->
        <el-dialog :title="dialogVisibleTit" :visible.sync="centerDialogVisible" width="50%" center @close="dialogclose">
            <el-form label-width="140px" :model="form" :rules="rules" ref="form" size="small">
                <el-form-item label="公司" prop="anm_branch_name">
                    <el-input v-model="form.anm_branch_name" placeholder="请输入公司名称"></el-input>
                </el-form-item>
                <el-form-item label="所属区域" prop="anm_area">
                    <el-input v-model="form.anm_area" placeholder="例：高新区"></el-input>
                </el-form-item>
                <el-form-item label="公司地址" prop="anm_branch_address">
                    <el-input v-model="form.anm_branch_address" placeholder="请输入公司地址"></el-input>
                </el-form-item>
                <el-form-item label="公司法人" prop="anm_legal">
                    <el-input v-model="form.anm_legal" placeholder="请输入公司法人"></el-input>
                </el-form-item>
                <el-form-item label="法人电话" prop="anm_legal_phone">
                    <el-input v-model="form.anm_legal_phone" placeholder="请输入法人电话"></el-input>
                </el-form-item>
                <el-form-item label="负责人" prop="anm_principal">
                    <el-input v-model="form.anm_principal" placeholder="请输入负责人"></el-input>
                </el-form-item>
                <el-form-item label="负责人电话" prop="anm_principal_phone">
                    <el-input v-model="form.anm_principal_phone" placeholder="请输入负责人电话"></el-input>
                </el-form-item>
                <el-form-item label="购买的年限" prop="anm_current_years">
                    <el-input type='number' v-model="form.anm_current_years" min="1" placeholder="请输入购买的年限"></el-input>
                </el-form-item>
                <el-form-item label="功能等级" prop="anm_current_grade">
                    <el-select v-model="form.anm_current_grade" placeholder="请选择功能等级">
                        <el-option v-for="(item,index) in gradeList" :key="index" :label="item.ap_name" :value="item.ap_id"></el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="app端能否登录" prop="anm_app_login">
                    <el-select v-model="form.anm_app_login" placeholder="请选择账号状态">
                        <el-option label="可以" value="2"></el-option>
                        <el-option label="不可以" value="1"></el-option> 
                    </el-select>
                </el-form-item>
                <el-form-item label="营业执照" :rules="[{ required: true, message: '请上传营业执照'}]" class="yyzzpic">
                    <!-- <el-upload class="avatar-uploader" list-type="picture-card" :action="upload()" :show-file-list="false" :on-success="yyzzAvatarSuccess" :before-upload="beforeAvatarUpload">
                        <img v-if="imageUrl" :src="imageUrl" class="avatar">
                        <i v-else class="el-icon-plus avatar-uploader-icon"></i>
                    </el-upload> -->

                    <el-upload :action="upload()" :class="{'disabled': yyzzuploadDisabled}" list-type="picture-card" :file-list="yyzzfilelist" :on-success="yyzzAvatarSuccess" :before-upload="beforeAvatarUpload" :on-preview="handlePictureCardPreview" :before-remove="yyzzhandleRemove">
                        <i class="el-icon-plus"></i>
                    </el-upload>

                </el-form-item>
                <el-form-item label="法人身份证正反面" :rules="[{ required: true, message: '请上传法人身份证正反面'}]" class="sfzpic">

                    <el-upload :action="upload()" style="display:inline-block;" :class="{'disabled':idZuploadDisabled}" :file-list="sfzzfilelist" list-type="picture-card" :on-success="idZAvatarSuccess" :before-upload="beforeAvatarUpload" :on-preview="handlePictureCardPreview" :before-remove="sfzZhandleRemove">
                        <i class="el-icon-plus"></i>
                    </el-upload>

                    <el-upload :action="upload()" style="display:inline-block;" :class="{'disabled':idFuploadDisabled}" :file-list="sfzffilelist" list-type="picture-card" :on-success="idFAvatarSuccess" :before-upload="beforeAvatarUpload" :on-preview="handlePictureCardPreview" :before-remove="sfzFhandleRemove">
                        <i class="el-icon-plus"></i>
                    </el-upload>

                </el-form-item>
            </el-form>
            <div slot="footer" class="dialog-footer">
                <el-button @click="cancelAdd('form')">取 消</el-button>
                <el-button type="primary" @click="addAccount('form')">确 定</el-button>
            </div>
        </el-dialog>
        <!-- 放大查看图片 -->
        <el-dialog :visible.sync="dialogVisible">
            <img width="100%" :src="dialogImageUrl" />
        </el-dialog>
        <!-- 创建表 -->
        <el-dialog :visible.sync="creatdialogVisible">
            <el-table :data="creatdata">
                <el-table-column align='center' property="name" label="表名"></el-table-column>
                <el-table-column label="操作" align="center" width="100">
                    <template slot-scope="scope">
                        <el-button @click="creatFun(scope.row)" size="mini" type="text" :disabled="scope.row.disabled">{{scope.row.disabled ? '已创建' : '创建'}}</el-button>
                    </template>
                </el-table-column>
            </el-table>
            <div style="text-align:center;margin-top: 30px;">
                <el-button type="primary" @click="creatbtn" size="small" :disabled="!btnstatus">创建完成启用账号</el-button>
            </div>
            
        </el-dialog>
    </div>
</template>
<style>
    .el-upload--picture-card{
        display: inline-block;
    }
    .disabled .el-upload--picture-card {
        display: none;
    }
</style>
<script src='../../contral/companys.js'></script>